<template>
  <component
    :formModel="formModel"
    v-model="formModel[item.modelName]"
    :placeholder="item.placeholder"
    :is="item.componentName"
    :item="item"
    :type="item.typeModel"
    :prefix-icon="item.icon"
    :icon="item.icon"
    :fun="item.fun"
    :min="item.min"
    :max="item.max"
    :rows="item.rows"
    :disabled="item.disabled"
    :options="item.options"
    :filterable="item.filterable"
    :remote="item.remote"
    :remote-method="item.remoteMethod"
    :loading="item.loading"
    :autosize="item.autosize"
    :fetch-suggestions="item.fetchSuggestions"
    :change-on-select="item.changeOnSelect"
    :show-all-levels="item.showAllLevels"
    :picker-options="item.pickerOptions"
    :range-separator="item.rangeSeparator"
    :end-placeholder="item.endPlaceholder"
    :start-placeholder="item.startPlaceholder"
    :popper-class="item.popperClass ? item.popperClass : ''"
    :format="item.format"
    :autofocus="item.autofocus ? item.autofocus : false"
    :value-format="item.valueFormat"
    :clearable="item.clearable"
    :controls="item.controls === false ? item.controls : true"
    :width="item.width"
    :append-to-body="item.appendBody === false ? item.appendBody : true"
    :style="`${'width:' + (item.width || '200px')};margin-left:${
      item.marginLeft
    };height:${item.height};line-height:${
      item.lineHeight ? item.lineHeight : item.height
    };font-weight:${item.fontWeight}`"
    :modelName="item.modelName"
    :plain="item.plain"
    :show-password="item.showPassword"
    @click="
      () => {
        this.click && this.click();
      }
    "
    @change="
      (val) => {
        this.change && this.change(val);
      }
    "
    @focus="
      () => {
        this.focus && this.focus();
      }
    "
    @blur="
      () => {
        this.blur && this.blur();
      }
    "
    @keydown.enter.native="
      (event) => {
        item.keydown && item.keydown(event);
        return false;
      }
    "
    >{{ item.text }}</component
  >
</template>

<script>
export default {
  name: "PUBLIC",
  props: [
    "formModel",
    "item",
    "options",
    "change",
    "click",
    "focus",
    "blur",
    "keydown",
  ],
  components: {},
  methods: {},
  mounted() {},
};
</script>
